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М React Native. ~ 
Хочу чат, как в Теіедгат! 


Бердышев Константин Олегович 


С Тесћ 
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Как это видит дизайнер-подрядчик 


ІП» 948 12:30 р Ф 4 Ш 12:30 "О Ф А 12:30 ГЕ! Ф А 12:30 


Чат х Чат Хх Чат X Чат X 


Ксюша 


Ксюша 


Ксюша 


Купила а давеча морковку в вашем 


магазине, шла домой пританцовывая в КС 
предвкушении морковного торта. 
Домой пришла, морковку достала - ата Сотрудничество 


сгнильцой оказаласы 


Саша 


Сотрудничество Вакансии Сотрудничество Вакансии 
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13:37 “ > | 


как правильно 


- Стикеры? 
- Конечно! И стикер-паки! ө "ә 99 
- ма, иа 
2 = є 
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Как правильно 


- Видео? 


- Безусловно 


13:37 .т-. 
х 


Ксения 


м/ 13:37 
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Как правильно 


- Офлайн? 


- Как же без этого?! 


13:37 1 т | 


Ө Не получилось :-( 
Сообщение не доставлено 


а 


Подробнее про вакансии 


Сотрудничество 155 


3:37 


Купила я давеча морковку в вашем 


магазине, шла домой пританцовывая 
в предвкушении морковного торта. 
Домой пришла, морковку достала — а 
та с гнильцой оказаласњ! 


Т. Отправить ещё раз 


® Удалить все 
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Как правильно 


- Системные сообщения? 


- Ну что за вопросы?! Нужны! 


13:37 1 т == 


Ксения 


Ө Оператор ушёл на перекур. 
Он вернётся очень скоро. 
Иначе будет уволен. 

Но это не точно. 


Не доставлено ||, 


Frontend 
Conf 2022 


Как правильно 


- Множественный выбор? 


- Ты «Telegram» видел? Давай все 


как там! 


13:37 1 т м, 


Ксения 


Максимальное количество 
отображаемых строк с 
прикрепляхами = 5 
BbIBbIBbIBbIBbIB 
BbIBbIBbIBÞbIBbIBbIBbIBbIbIABTCE| 


ОЦУЛЕІРЕІТТІҮШІШЦОІР 


АТІЗЦІПІГРІСІНІ УІКІІ 


е 82| х |су јвімім 


0 
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Web ВТС 


SERVER 


A 
\ 
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\ 
\ 
\ 
\ 
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СЦЕМТ 
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Web Sockets 
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СЦЕМТ СЦЕМТ CLIENT 
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(9 Whatsapp 


e Сообшения хранятся на үстройстве 
е Медиа временно хранится на сервере 


e Можно запаковать историю и выгрузить в свое облако 
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© Telegram 


e Сообшения хранятся на сервере 
е Медиа хранится на сервере 


• Часть истории хранится на устроистве 
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е Фото, файл, видео- все как файл | 
- 5% ТИНЬКОФФ 
• Медиа не сохраняются на устройстве 


• Предустановленные стикеры 
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• Только онлайн 
< Перекрёсток 
• Только изображения са 


• Предустановленные стикеры 
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• Только онлайн 
ВкусВилл 
e Только изображения. По одному за раз 


е Нет стикеров 
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Бзк от подрадчика 


1 


Socket 


Решение на 
WebSocket 


юздеск“' 


2 


SDK swift & Кот 


Нативные SDK 


Frontend 
Conf 2022 


Бзк от подрадчика 


= 


Файлы через РО5Т 


Отдельный энд-поинт 
для отправки файлов 


юздеск“' 


А 


Сообщения 


Сообщение отправляется 
независимо от файла 
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Бзк от подрадчика 


5 


Один файл за раз 


Нет возможности 
отправить группу 


юздеск“' 


© 


Нет стикеров 


Нет сушности отдельной. 
Отправка файлом 
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Бзк от подрадчика юздеск? 


Г] 


Нет превью Нет видео онлайн 
Нет легковесных картинок Формат отдачи не подходит 
ДЛЯ отображения «на лету» для нативного плеера 
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Бзк от подрадчика 


9 


Нет событий набора 


«Пользователь набирает» 
недоступно физически 


юздеск“' 


10 


Нет данных о просмотре 


Двойная галочка недоступна 
физически 
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Долгий путь видео (отправка) 


Выбор файла Превью 
МА FFMPEG 
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Долгий путь видео (отправка) 


Перекодирование 
МА FFMPEG 


Копирование 


«ер react-naitve-fs 


5 


Отправка... 
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Долгий путь видео (получение) 


1 2 


Получение ссылки Загрузка 
4%» react-naitve-fs 
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Долгий путь видео (получение) 


Создание превью Запись в БД 


МА FFMPEG О Realm 


Прибрать за собой 
«ер react-naitve-fs 
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сер react-native-fs 


e Загрузка и выгрузка 

• Сессии 

• Песочницы 105 

• Врема на копирование 
• Прибираите за собой 
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Й FFMPEG. Назначение 


е Первый кадр (превью) 

• Данные о видео 

• Перекодирование 

• Быстрый, надежный, консольный 


e ImageMagick, только для видео 
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Й ҒЕРгоре. Информация о видео 


• Не верь пользователю 
• Не верь расширению 


• Не верь отдельной мета-информации 
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" FFMPEG 
Греем камни 


• Ресурсы 
• Настройка 


е Реальность 


Й FFMPEG. Условная управляемость 


• Сама утилита — черный ящик 

• Многопоточная нативная обертка 
e Асинхронная обертка JS 

• Неоднозначность сессий 

• Разбор логов 
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Бу б mongoDB. 
> Realm 


e Быстрый 

e Хранение обьектов 
• Весь на дженериках 
• Легкие миграции 


• Поддержка Hermes 
• Нативцики в восторге 
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Бу ) топео В. 


J Realm. Клонирование 


e Сложные обьекты 


• Явные и неявные ПОДПИСКИ 


• Возможна инвалидация 


• Клонирование – геа|т здорового 
человека 
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by | топгорВ. 


J Realm. Контроллер 


e Много баз + много сессий = повышенное потребление ОЗУ (другими 
словами – за обе шеки) 


e Единственный вызов сіоѕе() закрывает все сессии данной БД 

• Выход - отдельный синглтон-контроллер 

• Каждый запрос открывает БД, работает с ней, безопасно закрывает 
• Запросы упаковываются в очереди 

• 50 строк кода 
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Бу || топоорВ. 


J Realm. Было несмешно 


• 150 сборок за две недели 
• Додо не осилили (но пицца в качестве не потерала) 


Frontend 
Conf 2022 


7 
7 (55 Тесһ 


Кость, не забудь показать 
демку с телефона! 
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